//Ext.apply(Ext.form.VTypes, {
//
//    password : function(val, field)
//	{
//        if (field.initialPassField) {
//            var login = Ext.getCmp(field.initialPassField);
//            return (val == login.getValue());
//        }
//        return true;
//    },
//    passwordText : 'Passwords do not match' //alert if you enter a password that is not the same
//});

Ext.apply(Ext.form.VTypes, {
   password: function(value, field)
   {
      if (field.initialPasswordField)
      {
         var pwd = Ext.getCmp(field.initialPasswordField);
         this.passwordText = 'Confirmation does not match your intial password entry.';
         return (value == pwd.getValue());
      }

      this.passwordText = 'Passwords must be at least 5 characters, containing either a number, or a valid special character (!@#$%^&*()-_=+)';

      var hasSpecial = value.match(/[0-9!@#\$%\^&\*\(\)\-_=\+]+/i);
      var hasLength = (value.length >= 5);

      return (hasSpecial && hasLength);
   },

   passwordText: 'Passwords must be at least 5 characters, containing either a number, or a valid special character (!@#$%^&*()-_=+)'
});

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
Ext.onReady(onReadyCall);
var panelusuario;
function onReadyCall()
{
   readControls_Login();

     var txtIdEmpresaArea = new Ext.form.NumberField({
        id: 'txtIdEmpresaArea',
        fieldLabel: 'IdEmpresaArea',
        width: 250,
        align:'left',
        allowNegatives: false,
        convertToUpperCase: true ,
        allowBlank:false,
        maxLength: 8,
        minLength:8
    });
     // txtdni.render('Divdni');

      var txtNombre = new Ext.form.TextField({
        id: 'txtNombre',
         fieldLabel: 'Nombre',
        allowBlank:false,
        width:250
    });
     // txtNombres.render('Divnombres');

       var txtDescripcion = new Ext.form.TextField({
        id: 'txtDescripcion',
         fieldLabel: 'Descripcion',
        allowBlank:true,
        width:250
    });
    //  txtApellidos.render('Divapellidos');

     var txtImagen = new Ext.form.TextField({
        id: 'txtImagen',
         fieldLabel: 'Imagen',
        allowBlank:false,
        width:250
    });
    //  txtDireccion.render('Divdireccion');

     var txtPrecio = new Ext.form.TextField({
        id: 'txtPrecio',
         fieldLabel: 'Precio',
        allowBlank:false,
        width:250
    });
     // txtTelefono.render('Divtelefono');

       var txtEstado = new Ext.form.TextField({
           fieldLabel: 'Estado',
           id: 'txtEstado',
           allowBlank: false,
           width: 250,
           maxLength: 20
    });
      var txtDireccion = new Ext.form.TextField({
           fieldLabel: 'Direccion',
           id: 'txtDireccion',
           allowBlank: false,
           width: 250,
           maxLength: 20
    });
     // txtClave.render('Divclave');

       var txtDireccionImagen = new Ext.form.TextField({
        id: 'txtDireccionImagen',
        allowBlank:false,
         fieldLabel: 'Grafico Direccion',
        width:250
    });

    /* * * * * * * * * * * *
     * Upload Image
     * * * * * * * * * * * *
     * * * * * * * * * * * */

    var picBox = {
		columnWidth: '100 px',
		bodyStyle: 'padding:10px',
		items: [
			{ xtype: 'box',
				autoEl: { tag: 'div',
					html: '<img id="pic" src="' + Ext.BLANK_IMAGE_URL + '" class="img-contact" />'
				}
			}
		]
	}

        var picFiles = {
		columnWidth: .65,
		layout: 'form',
		labelAlign:'top',
		items: [{
			xtype: 'textfield',
			fieldLabel: 'Current',
			labelSeparator: '',
			name: 'currPic',
			id:'currPic',
			readOnly: true,
			disabled:true,
			anchor:'100%'
		},
		{
			xtype: 'textfield',
			fieldLabel: 'New (JPG or PNG only)',
			labelSeparator: '',
			name: 'newPic',
			id:'newPic',
			style:'width: 300px',
			inputType: 'file',
			allowBlank: false
		}]
	}

        function validateFileExtension(fileName) {
		var exp = /^.*\.(jpg|JPG|png|PNG)$/;
		return exp.test(fileName);
	}

        var pictUploadForm = new Ext.FormPanel({
		frame: true,
		title: 'Change Picture',
		bodyStyle: 'padding:5px',
		width: 420,
		layout: 'column',
		url: 'contact-picture.aspx',
		method: 'POST',
		fileUpload: true,
		items: [picBox, picFiles],
		buttons: [{
			text: 'Upload Picture',
			handler: function() {
				var theForm = pictUploadForm.getForm();
				if (!theForm.isValid()) {
					Ext.MessageBox.alert('Change Picture',
					'Please select a picture');
					return;
				}
				if (!validateFileExtension(Ext.getDom('newPic').value)) {
					Ext.MessageBox.alert('Change Picture',
					'Only JPG or PNG, please.');
				return;
				}
				theForm.submit({
					params: { act: 'setPicture', id: 'contact1' },
					waitMsg: 'Uploading picture'
				})
			}
		},
		{
			text: 'Cancel'
		}]
	});

        pictUploadForm.on({
		actioncomplete: function(form, action) {
			if (action.type == 'load') {
				var pic = action.result.data;
				Ext.getDom('pic').src = pic.file;
				Ext.getCmp('currPic').setValue(pic.file);
			}
			if (action.type == 'submit') {
				var pic = action.result.data;
				Ext.getDom('pic').src = pic.file;
				Ext.getCmp('currPic').setValue(pic.file);
				Ext.getDom('newPic').value = '';
			}
		}
	});

        pictUploadForm.render(document.body);
	pictUploadForm.getForm().load({ params: { act: 'getPicture',
		id: 'contact1' }, waitMsg: 'Loading' });

     /* * * * * * * * * * * *
     * Upload Image
     * * * * * * * * * * * *
     * * * * * * * * * * * */

   var btnRegistrar = new Ext.Button({
    id: 'btnRegistrar',
    text: 'Registrar',
    width:80,
    handler: function(){
     }
    });
    // btnRegistrar.render('Divbtnregistrar');

     var btnLimpiar = new Ext.Button({
    id: 'btnLimpiar',
    text: 'Limpiar',
    width:80,
    handler: function(){
     }
    });
    // btnLimpiar.render('Divbtnlimpiar');
    panelusuario = new Ext.form.FormPanel({
                xtype: 'panel',
                frame:true,
                region:'center',
                 title: 'Registro Area de Empresa',
                layout: 'form',
                bodyStyle:'padding:15px 15px 0',
                width: 600,
                items: [
                      {
                        layout:'column',
                        items:[
                        {
                            columnHeight:.10,
                            layout: 'form'
                        }
                         ]
                    } ,
                     txtIdEmpresaArea,
                     txtNombre,
                     txtDescripcion,
                     txtImagen,
                     txtPrecio,
                     txtEstado,
                     txtDireccion,
                     txtDireccionImagen
                ],
                   buttons: [{
                    text: 'Registrar',
                    id:'btnregistrar',
                    align: 'center',
                    handler: function()
                    {
                        if(!panelusuario.getForm().isValid())
                        {
                          return false;
                        }
                        var v_idEmpresaArea = Ext.get('txtIdEmpresaArea').dom;
                        var v_nombre = Ext.get('txtNombre').dom;
                        var v_descripcion = Ext.get('txtDescripcion').dom;
                        var v_imagen = Ext.get('txtImagen').dom;
                        var v_precio = Ext.get('txtPrecio').dom ;
                        var v_estado = Ext.get('txtEstado').dom ;
                        var v_direccion = Ext.get('txtDireccion').dom ;
                        var v_direccionImagen = Ext.get('txtDireccionImagen').dom ;

                         if(v_idEmpresaArea.value =="")
                        {
                            v_idEmpresaArea.focus();
                            Ext.MessageBox.alert('Mensaje', 'Campo incorrecto!.');
                            return false;
                        }
                         if(v_nombre.value =="")
                        {
                            v_nombre.focus();
                            Ext.MessageBox.alert('Mensaje', 'Campo incorrecto!.');
                            return false;
                        }
                        if(v_imagen.value =="")
                        {
                            v_imagen.focus();
                            Ext.MessageBox.alert('Mensaje', 'Campo incorrecto!.');
                            return false;
                        }

                        if(v_precio.value =="")
                        {
                            v_precio.focus();
                            Ext.MessageBox.alert('Mensaje', 'Campo incorrecto!.');
                            return false;
                        }
                        if(v_estado.value =="")
                        {
                            v_estado.focus();
                            Ext.MessageBox.alert('Mensaje', 'Campo incorrecto!.');
                            return false;
                        }
                        if(v_direccion.value =="")
                        {
                            v_direccion.focus();
                            Ext.MessageBox.alert('Mensaje', 'Campo incorrecto!.');
                            return false;
                        }

                        if(v_direccionImagen.value =="")
                        {
                            v_direccionImagen.focus();
                            Ext.MessageBox.alert('Mensaje', 'Campo incorrecto!.');
                            return false;
                        }
   /**********************************/
     Ext.MessageBox.show({
       msg: 'Guardando los Datos , por favor espere...',
       progressText: 'Guardando...',
       width:300,
       wait:true//,
       //waitConfig: {interval:200}//,
       //icon:'ext-mb-download', //custom class in msg-box.html
       //animEl: 'mb7'
 });
    var AddResultItinerarios = new Ext.data.Connection();
    AddResultItinerarios.request({
        url: URLWebService + '/GrabaAreaEmpresa',
        params: {
                idEmpresaArea:  v_idEmpresaArea.value.replace(/^\s*|\s*$/g,""),
                nombre:   v_nombre.value.replace(/^\s*|\s*$/g,""),
                descripcion:   v_descripcion.value.replace(/^\s*|\s*$/g,""),
                imagen:   v_imagen.value ,
                precio:   v_precio.value ,
                estado:   v_estado.value ,
                direccion:   v_direccion.value,
                direccionImagen:   v_direccionImagen.value
                },
        method: 'POST',
        scope: this,
        callback: function(options, success, response){
        if (success){
             Ext.MessageBox.hide();
            var xml = response.responseText;
            var re = /\n/;
            xml = xml.replace(re, '');
            re = /\r/;
            xml = xml.replace(re, '');
            var ObjectRes =  Ext.decode(xml);
           // var ObjectRes= Ext.util.JSON.encode(xml);
            ObjectRes= ObjectRes.MensajeResultado;
            var return_Estado = ObjectRes.ESTADO;
            var return_Mensaje = ObjectRes.MENSAJE ;
            Ext.MessageBox.show({
               title: 'Resultado',
               msg: return_Mensaje,
               buttons: Ext.MessageBox.OK,
               fn: function(){
                if(return_Estado == 1)
                {
                  LimpiarPanel();
                   location.reload();
                }else
                {

                }

               }
           });
      }
      }
    });
   /********************************/
                    }
                    }, {
                    text: 'Limpiar',
                    handler: function(){
                        LimpiarPanel();
                    }
                 }]
            });
             panelusuario.render('Divusuario');
}

function LimpiarPanel()
{
    Ext.get('txtIdEmpresaArea').dom.value = "";
    Ext.get('txtNombre').dom.value = "";
    Ext.get('txtDescripcion').dom.value = "";
    Ext.get('txtImagen').dom.value = "";
    Ext.get('txtPrecio').dom.value = "";
    Ext.get('txtEstado').dom.value = "";
    Ext.get('txtDireccion').dom.value = "";
    Ext.get('txtDireccionImagen').dom.value = "";
}

